<!DOCTYPE html>
<html lang="zh_CN">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .bg {
            background-color: #ccc;

        }

        .bd {
            border: 1px solid #f00;
        }

        .fz30 {
            font-size: 30px;
        }
    </style>
</head>
<body>
<div id="app">
    <h2>{{ title }}</h2>
    <p>
        当使用v-model 和 data 里面的某个属性 kw 进行绑定后，后面表单的内容就会自动的赋值 kw
    </p>
    <div>
        性别：
        <input type="radio" v-model="gender" value="0">保密
        <input type="radio" v-model="gender" value="1">男
        <input type="radio" v-model="gender" value="2">女
    </div>

</div>

</body>
<script src="lib/vue/vue.js"></script>

<script type="text/javascript">


    const vm = new Vue({
        el: '#app',
        data: {
            // 普通的字符串
            title: 'vuejs 之 v-model 的使用',
            kw: '', // data 里面的 kw 用于接收表单的数据信息
            gender: 0, // gender 用于收集表单单选框的值 0代表保密 1男 2女


        }
    })

</script>

</html>
